<template>

  <div class="container" style="display: flex;flex-direction: column;">

    <exam-result-tips :pass-score="passScore" :total-score="totalScore"/>

    <exam-result-info :result="result" :right-cnt="totalRightCnt"/>

    <div @click="onExamAgainClick"
         :class=" this.isMobile ? 'btn againBtn' : 'btn againBtn pointer'"
         v-if="canRepeat&&!isPassed">
      重新考试
    </div>
    <div @click="onAnalysisClick"
         :class=" this.isMobile ? 'btn analysisBtn' :'btn analysisBtn pointer'"
         v-if="isMockExam">
      查看分析
    </div>
  </div>


</template>

<script>
  import ExamResultTips from '../components/ExamResultTips'
  import ExamResultInfo from '../components/ExamResultInfo'
  import ExamResultMixin from "../exam-result-mixin";
  import ExamTool from "../../exam/ExamTool";
  import {replace} from "../../../../router/util";

  export default {
    components: {ExamResultInfo, ExamResultTips},
    mixins: [ExamResultMixin],
    methods: {
      onExamAgainClick() {
        if(this.type == 1){
          ExamTool.checkCanExam(this.subjectId, this.examId).then(() => {
            replace(`/exam/normal/${this.examId}/${this.subjectId}/1`)
          })
        }else if(this.type == 2) {
          ExamTool.checkCanExamPlan(this.subjectId).then(() => {
            replace(`/exam/normal/${this.examId}/${this.subjectId}/2`)
          })
        }
      },
      onAnalysisClick() {
        replace(`/exam/analyze/${this.examResultId}`)
      },

    },
  }
</script>

<style scoped>

  .container {
    align-items: center;
  }

  .btn {
    width: 160px;
    height: 48px;
    border-radius: 4px;
    font-size: 20px;
    font-weight: bold;
    line-height: 48px;
    text-align: center;
  }

  .againBtn {
    margin-top: 56px;
    background-color: #1286F7;
    color: white;
  }

  .analysisBtn {
    margin-top: 16px;
    background-color: white;
    color: #1286F7;
    border: 1px #1286F7 solid;
  }
</style>
